<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>盒子模型文字阴影(box model text shadow)</title>
  <!-- 
    CSS的盒子模型中的文本阴影（Text Shadow）是一种样式效果，可以为文本添加阴影，增强其视觉效果。以下是CSS盒子模型中文本阴影的主要要点： 
 
      1. 阴影颜色（Shadow Color）：可以通过设置text-shadow属性来定义阴影的颜色，可以使用颜色名称、十六进制值或RGB值来指定阴影颜色。 
      2. 模糊程度（Blur Radius）：可以通过设置text-shadow属性中的第二个值来定义阴影的模糊程度，值越大阴影越模糊。 
      3. 横向偏移（Horizontal Offset）：可以通过设置text-shadow属性中的第三个值来定义阴影在水平方向上的偏移量，正值向右偏移，负值向左偏移。 
      4. 纵向偏移（Vertical Offset）：可以通过设置text-shadow属性中的第四个值来定义阴影在垂直方向上的偏移量，正值向下偏移，负值向上偏移。 
      5. 多重阴影：可以通过在text-shadow属性中添加多个阴影值来为文本添加多重阴影效果。
      写法：text-shadow: 水平偏移 垂直偏移 模糊程度 阴影颜色;
   -->
  <style>
    .text-shadow {
      font-size: 32px;
      font-weight: bold;

      text-shadow: 2px 2px 4px #000000, 8px 8px 6px orange, 12px 12px 7px green, 16px 16px 10px red;
    }
  </style>
</head>

<body>

  <div class="text-shadow">my name Text Shadow</div>

</body>

</html>